© 2024. All rights reserved.

Cypress 讀書會

在 Docker Container 跑 Visual Testing 之基本設定

Cypress + Docker + Chromatic ❤️

April 5, 2022 visual testing Docker Chromatic Cypress 自動化測試視覺測試 End-to-End Testing 端對端測試閱讀筆記 Cypress 讀書會 cypress.io visual regression testing 讀書會 · 留言

利用 Chromatic + Storybook 來做 Component-Level 的 Visual Testing

利用 Chromatic + Storybook 來做 Component-Level 的 Visual Testing。

March 4, 2022 visual testing Chromatic Storybook Percy Mixtini 自動化測試視覺測試 CI/CD GitHub Actions 讀書會閱讀筆記 Cypress Cypress 讀書會 visual regression testing · 留言

利用 Cypress 與 Percy 來做 Visual Testing

視覺測試 (visual testing) 是指利用工具自動檢測 UI 變更的一種測試方式。過去我們檢視 UI 的變更，常用的方法大致是 (1) 人眼 (截圖) 比對，比較本次更新與上一版或 mockup 的差異；(2) 工具 diff 由 unit test 或各種測試所產生的快照 (snapshot test)。但這兩種方式都無法很直覺很明確的在第一時間告訴我們到底改了什麼？若能產生指定頁面或元件的圖檔，並且標註更新的部份，這樣在 review 的時候，就更省時更便利了。

February 26, 2022 Percy Storybook visual testing Cypress 視覺測試自動化測試 GitHub Actions visual regression testing CI/CD End-to-End Testing 端對端測試讀書會 cron job cypress.io GitHub 閱讀筆記 Cypress 讀書會 · 留言